import {
  get@{modelName}ById,
  get@{modelName}All,
  get@{modelName}PageList,
  commonUpdate,
  update@{modelName},
  add@{modelName},
  delete@{modelName}
} from '@/services/@{serviceName}Service';
import { PageContainer } from '@ant-design/pro-layout';
import type { ProColumns, ActionType } from '@ant-design/pro-table';
import ProTable from '@ant-design/pro-table';
import { Button, Divider, message, Popconfirm, Space, Typography } from 'antd';
import React, { useRef, useState } from 'react';

/**
 * 
 * @constructor
 */
const @{modelName}Page: React.FC<unknown> = () => {
  const [updateData, setUpdateData] = useState<@{modelName}Type.@{modelName}>(
    {} as @{modelName}Type.@{modelName},
  );
  const actionRef = useRef<ActionType>(); 

  /**
   * 
   * @param 
   */
  const doDelete = async (model: @{modelName}Type.@{modelName}) => {
    const hide = message.loading('正在删除');
    if (!model?.Id) {
      return;
    }
    try {
      await delete@{modelName}({
        id: model.Id,
      });
      message.success('操作成功');
      actionRef.current?.reload();
    } catch (e: any) {
      message.error('操作失败，' + e.message);
    } finally {
      hide();
    }
  };

  /**
   * 
   */   
  const columns: ProColumns<@{modelName}Type.@{modelName}>[] = [
    @{for(field in entity.FieldDto)}
    {
       title: @{if(field.FieldName==primaryKey)}'id'@{else}'@{field.FieldComment}'@{end},
       dataIndex:'@{field.FieldName}'
    },
    @{end}
    {
      title: '操作',
      dataIndex: 'option',
      valueType: 'option',
      render: (_:any, record:any) => (
        <Space split={<Divider type="vertical" />}>
          <Typography.Link
            onClick={() => {
              setUpdateData(record);
            }}
          >
            修改
          </Typography.Link>
          <Popconfirm
            title="您确定要删除么？"
            onConfirm={() => doDelete(record)}
            okText="确认"
            cancelText="取消"
          >
            <Typography.Link type="danger">删除</Typography.Link>
          </Popconfirm>
        </Space>
      ),
    },
  ];

  return (
    <PageContainer>
      <ProTable<@{modelName}Type.@{modelName}>
        headerTitle="@{tableComment}管理"
        actionRef={actionRef}
        rowKey="id"
        search={{
          labelWidth: 'auto',
          defaultCollapsed: false,
        }}
        toolBarRender={() => [
          <Button
            key="1"
            type="primary"
          >
            新建
          </Button>,
        ]}
        request={async (params:any, sorter:any) => {
        const searchParams: PageInfo.PageRequest = {
            pageSize: params.pageSize,
            current: params.current
          };

          let sortQuery = "", filterQuery = "";
          // eslint-disable-next-line guard-for-in
          for (const key in sorter) {
            sortQuery += `${key}|${sorter[key]}`;
          }

          if (sortQuery != "") {
            searchParams['@sort'] = sortQuery;
          }

          for (const key in params) {
            if (key !== "pageSize" && key !== "current") {
              if (params[key] != "") {
                filterQuery += `contains(${key},${params[key]})&`;
                params[key] = '';
              }
            }
          }

          if (filterQuery != "") {
            searchParams['@filter'] = filterQuery;
          }

          searchParams['@relationships'] = "UserInfo";
          const { Items, StatusCode } = await get@{modelName}PageList(searchParams);
          return {
            data: Items[0]?.Records || [],
            success: StatusCode === 200,
            total: Items[0].Total,
          } as any;
        }}
        columns={columns}
      />
    </PageContainer>
  );
};

export default @{modelName}Page;
